<template>
    <div>
        <div class="cardsviews">
            <div class="cardimgs">
                <img v-show="imgsUrl.zmurl" :src="imgsUrl.zmurl"/>
                <img v-show="!imgsUrl.zmurl" src="../../assets/img/zcard.png"/>
                <wxupload choosetype="1" v-if="binfo.sign_status!=1" @uploadsucess="uploadsucess"></wxupload>
              <div v-show="!imgsUrl.zmurl" class="tipinfo">请上传身份证人像面信息</div>
            </div>

        </div>
        <div class="cardsviews">
            <div class="cardimgs">
                <img v-show="imgsUrl.fmurl" :src="imgsUrl.fmurl"/>
                <img v-show="!imgsUrl.fmurl" src="../../assets/img/fcard.png"/>
                <wxupload v-if="binfo.sign_status!=1" choosetype="2" @uploadsucess="uploadsucess"></wxupload>
              <div v-show="!imgsUrl.fmurl" class="tipinfo">请上传身份证国徽面信息</div>
            </div>
        </div>
        <div style="text-align: center">
          <el-button style="background-color: #3E8CF3; width: 90%; height: 40px; " type="primary" @click="comfirmClose()">确定</el-button>
        </div>
    </div>

</template>

<script>
    import {HOST, IMG_URL} from '@/constants'
    export default {
        name: "mobile-card",
        props: ['binfo'],
        data() {
            return {
                imgsUrl: {
                    zmurl: '',
                    fmurl: '',

                },
            }
        },
        created() {
            //获取默认图片
            if(this.binfo.zidimg) {
                this.imgsUrl.zmurl = IMG_URL + this.binfo.zidimg
            }
            if (this.binfo.fidimg) {
                this.imgsUrl.fmurl = IMG_URL + this.binfo.fidimg
            }
        },
        methods: {
          comfirmClose(){
            // console.log(this.imgsUrl.fmurl)
            if(!this.imgsUrl.zmurl || !this.imgsUrl.fmurl){
              this.$message({
                message: '请上传身份证',
                type: 'error',
                showClose: true
              });
              return false;
            }else{
              this.close()
            }
          },
            uploadsucess(value) {
                // console.log(uploadsucess)
                if (value.type == 3) {
                    this.imgsUrl.gsurl = value.img

                }
                if (value.type == 1) {
                    this.imgsUrl.zmurl = value.img
                    this.callback();

                }
                if (value.type == 2) {
                    this.imgsUrl.fmurl = value.img
                    this.callback();

                }
            }

        }
    }
</script>

<style lang="scss" scoped>
    .cardsviews {
        margin: 0 30px;
        padding: 20px 0;
        position: relative;

    .cardimgs {
        position: relative;
        overflow: hidden;

    img {
        width: 100%;
    }

    }
    .tipinfo {
        text-align: center;
        color: #040404;
      margin-top: -30px;
      padding-bottom: 20px;
    }

    }
</style>
